<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{$web_name}-编辑 - 角色权限</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="__HOME__/static/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="__HOME__/static/layuiadmin/style/admin.css" media="all">
    <style type="text/css">
        .layui-table-cell{
            text-align: center;
            height: auto;
            white-space: normal;
        }
    </style>
</head>
<body>
<input type="hidden" id="role_id" name="role_id">
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="menu" class="layui-table" lay-filter="menu"></table>
            <script type="text/html" id="show_tpl">
                <input type="checkbox"  menu_id="{{d.id}}" id="role_{{d.id}}" lay-skin="switch" lay-text="允许|禁止"  lay-filter="thisStatus" >
            </script>
            <!--这个是选择框tpl-->

        </div>
    </div>
</div>

<script src="__HOME__/static/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '__HOME__/static/layuiadmin/' //静态资源所在路径
    }).extend({
        index: '/lib/index', //主入口模块
        treetable : 'treetable-lay/treetable',
    }).use(['form','index','treeTable', 'layer'], function () {
        var $ = layui.$
            ,form = layui.form
            ,layer = layui.layer
            ,treeTable = layui.treeTable;
        //Ajax设置
        $.ajaxSetup({
            type: 'POST',
            dataType : "json",
            data:{type:1},
            cache:false,
            crossDomain: true,
            // 发送cookie
            xhrFields: {
                withCredentials: true
            },
        });
        //渲染表格
        var insTb = treeTable.render({
            elem: '#menu',
            id:'menu',
            url:  '{fun:ctr("../Auth/adminMenuList")}',
            tree: {
                iconIndex: 1,           // 折叠图标显示在第几列
                isPidData: true,        // 是否是id、pid形式数据
                idName: 'id',  // id字段名称
                pidName: 'parent_id'     // pid字段名称
            },
            cols: [[
                {type: 'checkbox'},//LAY_CHECKED:true
                {field: 'name', title: '名称'},
                {field: 'is_menu', title: '是否菜单', templet: function(d){
                        if(d.is_menu==1){
                            return '<a style="color: #2ecc71">是</a>';
                        }else{
                            return '<a style="color: #e51a1a">否</a>';
                        }
                    }
                },
                {field: 'shop_status', title: '状态', align: 'center',toolbar: '#show_tpl'},
            ]]
            ,done:function (){
                $.ajax({
                    url:  '{fun:ctr("../Auth/rolePermissionData")}',
                    data: {"role_id":$("input[name='role_id']").val()},
                    success : function(res) {
                        if(res.code == 200){
                            var ids = res.data;
                            for(var i=0;i<ids.length;i++){
                                $("#role_"+ids[i].menu_id).attr('checked',true);
                            }
                            form.render();
                        }
                    },
                });
            }
        });
        //监听switch（添加权限）事件
        form.on('switch(thisStatus)', function(data){
            var role_id = $("input[name='role_id']").val()
            var menu_id = data.elem.attributes['menu_id'].nodeValue;
            var thisStatus =this.checked ? '1' : '2';
            //用户状态更新
            $.ajax({
                url:  '{fun:ctr("../Auth/addRolePermissionData")}',
                data: {"role_id":role_id,menu_id:menu_id,thisStatus:thisStatus},
                success : function(data) {
                    if(data.code == 200){
                        layer.msg(data.msg, {icon: 1});
                    }else if(data.code == -7){
                        layer.msg(data.msg, {icon: 2});
                        window.setTimeout(function () {
                            top.location = '{fun:ctr("../../Login")}';
                        }, 1000);
                    }else{
                        layer.msg(data.msg, {icon: 2});
                    }
                },
            });
        });

    })
</script>
</body>
</html>
